<!DOCTYPE html>
<html>
<head>
    <title>添加-角色权限管理</title>
    {include file="common/inc_meta" /}
</head>
<body>
 <div id="wrapper">
    {include file="common/inc_menu" /}
       <div id="page-wrapper" class="gray-bg">
          {include file="common/inc_top" /}
            <div class="row wrapper border-bottom white-bg page-heading" style="padding-top:20px;font-weight: normal;position: relative;">
                <div class="col-sm-4">
                    <h2 style="margin-bottom:10px;">角色权限管理</h2>
                    <ol class="breadcrumb">
                        <li><a href="{$admin.index_page}">主页</a></li>
                        <li><a>权限</a></li>
                        <li class="active"><strong>添加</strong></li>
                    </ol>
                </div>
                <div class="col-lg-5" style="position: absolute;top:33px;right:0px;text-align: right;">
                    <a href="javascript:saveAction();" class="btn btn-outline btn-primary btn-sm">保存</a>
                </div>
            </div>
            <div class="wrapper wrapper-content animated fadeInRight">
                

             <div class="row">
                <div class="col-lg-12">
                    <div class="ibox float-e-margins">
                        <div class="ibox-content" style="padding:20px;">
                            <form class="form-horizontal" id="myForms">
                                <div class="form-group">
                                    <label class="col-sm-2 control-label">角色名称</label>
                                    <div class="col-sm-4"><input type="text" class="form-control" maxlength="20" id="vTitle"></div>
                                    <label class="col-sm-1 control-label">状态</label>
                                    <div class="col-sm-2">
                                       <label class="checkbox-inline i-checks"> <input type="radio" value="1" name="ustatus" checked="true"> 开启</label>
                                       <label class="checkbox-inline i-checks"> <input type="radio" value="0" name="ustatus"> 关闭</label>
                                    </div>
                                </div>
                                <div class="hr-line-dashed"></div>
                                <div class="form-group"><label class="col-sm-2 control-label">上级</label>
                                    <div class="col-sm-4">
                                         <select class="form-control" id="vPid">
                                            <option value="0">无</option>
                                            {volist name="group" id="vo"}
                                            <option value="{$vo.id}">{$vo.name}</option>
                                            {/volist}
                                         </select>
                                    </div>
                                    <label class="col-sm-1 control-label">超级管理</label>
                                    <div class="col-sm-2" id="supperBox">
                                       <label class="checkbox-inline i-checks"> <input type="radio" value="1" name="uadmin"> 是</label>
                                       <label class="checkbox-inline i-checks"> <input type="radio" value="0" name="uadmin" checked="true"> 否</label>
                                    </div>
                                </div>
                                <div class="hr-line-dashed"></div>
                                <div class="form-group"><label class="col-sm-2 control-label">备注</label>
                                    <div class="col-sm-4"><input type="text" class="form-control" id="vRemark" value=""></div>
                                    <label class="col-sm-1 control-label">工作台首页</label>
                                    <div class="col-sm-2"><input type="text" class="form-control" id="vPages" value="/admin/index/index"><span class="help-block m-b-none">/模块/控制器/方法</span></div>
                                </div>
                                <div class="hr-line-dashed"></div>
                                <div class="form-group"><label class="col-sm-2 control-label">角色权限设置</label>
                                    <div class="col-sm-10" id="rulebox">

                                          <ul class="rule-one">
                                             <!--{volist name="rule" id="va"}-->
                                              <li><label class="checkbox-inline i-checks"><input type="checkbox" value="{$va.id}" name="rule_one"> <em>{$va.title}</em></label>
                                                   <ul class="rule-two">
                                                       <!--{volist name="va.childlist" id="vb"}-->
                                                       <li><label class="checkbox-inline i-checks"><input type="checkbox" value="{$vb.id}" name="rule_two"> {$vb.title}</label>
                                                          <ul class="rule-third">
                                                              <!--{volist name="vb.childlist" id="vc"}-->
                                                              <li {if $vc.childlist}style="width:100%;display:inline-block;"{/if}><label class="checkbox-inline i-checks"><input type="checkbox" value="{$vc.id}" name="rule_third"> {$vc.title}</label>
                                                              <!--{if $vc.childlist}-->
                                                                  <ul class="rule-four">
                                                                  <!--{volist name="vc.childlist" id="vd"}-->
                                                                    <li><label class="checkbox-inline i-checks"><input type="checkbox" value="{$vd.id}" name="rule_four"> {$vd.title}</label></li>
                                                                  <!--{/volist}-->
                                                                  </ul>
                                                              <!--{/if}-->
                                                              </li>
                                                              <!--{/volist}-->
                                                          </ul>
                                                       </li>
                                                       <!--{/volist}-->
                                                   </ul>
                                              </li>
                                              <!--{/volist}-->
                                          </ul>

                                    </div>
                                </div>

                                <div class="hr-line-dashed"></div>
                                <div class="form-group">
                                    <div class="col-sm-4 col-sm-offset-2">
                                        <a href="{:url('admin/authgroup/index')}" class="btn btn-white">返回</a>&nbsp;&nbsp;&nbsp;&nbsp;
                                        <button class="btn btn-primary" type="button" id="saveButton">保存</button>
                                    </div>
                                </div>
                            </form>
                        </div>
                    </div>
                </div>
            </div>


            </div>
     {include file="common/inc_footer" /}
     </div>
 </div>
<!-- Mainly scripts -->
{include file="common/inc_jsfile" /}
 {include file="common/back_top" /}
<!-- iCheck https://www.cnblogs.com/xp796/p/5508145.html-->
<script src="__ADMIN__/js/plugins/iCheck/icheck.min.js"></script>
<script>
$(function(){
   $('.i-checks').iCheck({
        checkboxClass: 'icheckbox_square-green',
        radioClass: 'iradio_square-green',
   });
   //保存
   $("#saveButton").click(function(){
     saveAction();
   });
   $('#vTitle').focus();
   //目录树全选定/取消全选定
   $('#supperBox input:radio').on('ifClicked', function(event){
      if($(this).val() == '1')
      {
         $('#rulebox input:checkbox').each(function(i,e){ 
            $(this).iCheck('check');
         });
      }else{
         $('#rulebox input:checkbox').each(function(i,e){ 
            $(this).iCheck('uncheck');
         });
      }
   });
   //目录树选择事件
   $('#rulebox input:checkbox').on('ifClicked', function(event){
      var _name = $(this).attr('name');
      if($(this).prop("checked")) //选中
      {
        if(_name == 'rule_one')
        {
          $(this).parent().parent().parent().find('input:checkbox').each(function(i,e){ 
            $(this).iCheck('uncheck');
          });
        }
        if(_name == 'rule_two')
        {
          $(this).parent().parent().parent().find('input:checkbox').each(function(i,e){ 
            $(this).iCheck('uncheck');
          });
          var _t = 0;
          $(this).parent().parent().parent().parent().find('input:checkbox').each(function(i,e){
             if($(this).is(':checked')){_t++;}
          });
          if(_t <= 0)
          {
            $(this).parent().parent().parent().parent().parent().children('label').find('input:checkbox').iCheck('uncheck');
          }
        }
        if(_name == 'rule_third')
        {
          // var _k = 0,_t3 = 0;
          // $(this).parent().parent().parent().parent().find('input:checkbox').each(function(i,e){ 
          //    if($(this).is(':checked')){_k++;}
          // });
          // $(this).parent().parent().parent().parent().parent().parent().find('input:checkbox').each(function(i,e){
          //    if($(this).is(':checked')){_t3++;}
          // });
          // if(_t3 <= 2)
          // {
          //   if(_k <= 1)
          //   {
          //     $(this).parent().parent().parent().parent().parent().children('label').find('input:checkbox').iCheck('uncheck');
          //   }
          //   $(this).parent().parent().parent().parent().parent().parent().parent().children('label').find('input:checkbox').iCheck('uncheck');
          // }
        }
        if(_name == 'rule_four')
        {
          var _t = 0;
          $(this).parent().parent().parent().parent().parent().children('ul').find('input:checkbox').each(function(i,e){
             if($(this).is(':checked')){_t++;}
          });
          if(_t <= 0)
          {
            $(this).parent().parent().parent().parent().parent().children('label').find('input:checkbox').iCheck('uncheck');
          }
        }
      }else{ //没选中
        if(_name == 'rule_one')
        {
          $(this).parent().parent().parent().find('input:checkbox').each(function(i,e){ 
            $(this).iCheck('check');
          });
        }
        if(_name == 'rule_two')
        {
          $(this).parent().parent().parent().find('input:checkbox').each(function(i,e){ 
            $(this).iCheck('check');
          });
          $(this).parent().parent().parent().parent().parent().children('label').find('input:checkbox').iCheck('check');
        }
        if(_name == 'rule_third')
        {
          var _k = 0;
          $(this).parent().parent().parent().parent().find('input:checkbox').each(function(i,e){ 
             if($(this).is(':checked')){_k++;}
          });
          if(_k <= 0)
          {
            $(this).parent().parent().parent().parent().parent().children('label').find('input:checkbox').iCheck('check');
            $(this).parent().parent().parent().parent().parent().parent().parent().children('label').find('input:checkbox').iCheck('check');
          }
        }
        if(_name == 'rule_four')
        {
          var _k = 1;
          $(this).parent().parent().parent().parent().parent().children('ul').find('input:checkbox').each(function(i,e){ 
             if($(this).is(':checked')){_k++;}
          });
          if(_k > 0)
          {
            $(this).parent().parent().parent().parent().parent().children('label').find('input:checkbox').iCheck('check');
            $(this).parent().parent().parent().parent().parent().parent().parent().parent().children('label').find('input:checkbox').iCheck('check');
          }
        }
      }
   });
});

//获取选择的值
function getCheckedValue()
{
 var _idarr = {},_k = 0;
 $("#rulebox input:checkbox").each(function(){
   if($(this).is(':checked'))
   {
    _idarr[_k] = $(this).val();
    _k++;
   }
 });
 if(parseInt(_k) <= 0)
 {
   return '';
 }else{
   return _idarr;
 }
}
 
//保存
function saveAction()
{
 var param = {};
 param.v_title = $.trim($('#vTitle').val());
 param.v_pid = $.trim($('#vPid').val());
 param.v_status = $.trim($("input[name='ustatus']:checked").val());
 param.v_remark = $.trim($('#vRemark').val());
 param.v_admin = $.trim($("input[name='uadmin']:checked").val());
 param.v_pages = $.trim($('#vPages').val());
 param.v_arr = getCheckedValue();
 if(param.v_title.length <= 0)
 {
   $('#vTitle').focus();
   layer.msg('请填写角色名称', {time: 2000,anim: 6,shade:[0.4,'#000000']});
   return false;
 }
 _Admin.ajax("{:url('admin/authgroup/add')}",param,function(d){
   if(d.err == '0')
   {
     $('#myForms')[0].reset();
     $('#vTitle').focus();
     layer.msg(d.msg, {time: 1000,shade:[0.4,'#000000']},function(){window.location.reload();});
   }else{
     layer.msg(d.msg, {time: 2000,anim: 6,shade:[0.4,'#000000']});
   }
 });  
}
</script>
</body>
</html>
